<template>
  <!-- 弱弹框 -->
  <van-dialog
    class="confirm-week-dialog"
    v-model:show="show"
    :show-confirm-button="false"
  >
    <div class="title-line">
      {{ props.titleText }}
    </div>
    <div class="edit-content">
      <div class="content-text">{{ props.contentText }}</div>
      <div class="content-red-text">{{ props.contentRedText }}</div>
    </div>
    <div @click="setVisible(false)" class="button-operation">
      {{ props.buttontext }}
    </div>
  </van-dialog>
</template>

<script setup>
const props = defineProps({
  buttontext: {
    type: String,
    default: "我知道了",
  },
  contentText: {
    type: String,
    default: "修改批注提交成功，小编会根据你的批注意见进行修改",
  },
  contentRedText: {
    type: String,
    default: "您还剩2次修改次数",
  },
  titleText: {
    type: String,
    default: "提交成功",
  },
});
const show = ref(false);
const setVisible = (value) => {
  show.value = value;
};
defineExpose({
  setVisible,
});
</script>

<style lang="scss">
.confirm-week-dialog {
  width: 83%;
  height: 212px;
  background: #ffffff;
  border-radius: 8px;
  padding: 24px 16px;
  box-sizing: border-box;
  text-align: center;
  .button-operation {
    width: 220px;
    height: 36px;
    line-height: 36px;
    border-radius: 8px;
    border: 2px solid #4560e6;
    margin: 0 auto;
    font-family: PingFang SC, PingFang SC;
    font-weight: bold;
    font-size: 14px;
    color: #4560e6;
  }
  .title-line {
    font-family: PingFang SC, PingFang SC;
    font-weight: bold;
    font-size: 16px;
    color: #333333;
    line-height: 16px;
  }
  .edit-content {
    height: 112px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    .content-text {
      font-family: Microsoft YaHei UI, Microsoft YaHei UI;
      font-weight: 400;
      font-size: 12px;
      color: #666666;
    }
    .content-red-text {
      font-family: Microsoft YaHei UI, Microsoft YaHei UI;
      font-weight: 400;
      font-size: 12px;
      color: #e62e3d;
      margin-top: 8px;
    }
  }
}
</style>
